import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

/*
  課程模塊Card，封裝分離出Card組件，減少代碼量
  ｜名稱｜參數類型｜作用｜必需｜
  ｜----｜----｜----｜-----｜
  ｜title｜String｜卡片標題｜true｜
  ｜ObjectId｜String｜課程id｜true（不顯示跳轉使用）｜
  ｜bl｜bool｜是否將卡片變大｜true｜
  ｜src｜String｜卡片背景圖片｜false（默認顯示暫無圖片）｜
  ｜description｜String｜描述信息｜false｜
  ｜color｜Color｜顏色｜false｜
 */

class CourseTutorialCard extends StatelessWidget {
  /// 標題
  final String title;

  /// 課程id
  final String objectId;

  /// 是否放大
  final bool bl;

  /// 圖片路徑
  final String src;

  /// 描述信息
  final String description;

  /// 顏色
  final Color color;

  /// 點擊事件
  final VoidCallback onPressed;

  /// 高度
  final num height;

  /// 宽度
  final num width;

  /// 分类文字颜色
  final Color titleColor;

  const CourseTutorialCard(
      {Key key,
      @required this.title,
      @required this.objectId,
      @required this.bl,
      this.src,
      this.description,
      @required this.color,
      this.onPressed,
      this.height = 162,
      this.width = 132,
      this.titleColor})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onPressed,
      child: Stack(
        alignment: Alignment.bottomLeft, //元素居中
        children: <Widget>[
          Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              Container(
                height: ScreenUtil().setHeight(height),
                width: ScreenUtil().setWidth(width),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: src != null
                      ? Image.network(src, fit: BoxFit.fill)
                      : Image.asset(
                          'images/noimg.jpg',
                          fit: BoxFit.fill,
                        ),
                ),
              ),
            ],
          ),
          Container(
            padding: EdgeInsets.only(left: 10),
            height: ScreenUtil().setHeight(75),
            width: ScreenUtil().setWidth(132),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8),
                gradient: LinearGradient(
                    colors: [Colors.transparent, titleColor],
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter)),
            child: Column(
//              crossAxisAlignment: CrossAxisAlignment.end,
              mainAxisAlignment: MainAxisAlignment.end,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    classificationWidget(title: "课程分类")
                  ],
                ),
                Container(
                  padding: EdgeInsets.only(left: 10),
                  margin: EdgeInsets.only(bottom: 15),
                  width: ScreenUtil().setWidth(120),
                  child: Text(
                    title,
                    textAlign: TextAlign.left,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: ScreenUtil().setSp(16),
                      fontWeight: FontWeight.bold,
                      fontFamily: "SemiBold",
                    ),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  /// 分类
  Widget classificationWidget({String title}) {
    return Container(
        margin: EdgeInsets.only(bottom: 5),
        padding: EdgeInsets.only(left: 10,right: 10,top: 5,bottom: 5),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(30.0), //邊框
        ),
        child: Center(
          child: Text(
            title,
            style: TextStyle(
                fontSize: ScreenUtil().setSp(9),
                fontWeight: FontWeight.w500,
                color: titleColor),
          ),
        ));
  }
}
